<template>
  <the-table :columns="columns" uri="/a/buys" ref="table">
    <!--还没做好-->
    <span slot="action" slot-scope="{ row }">
      <a-popconfirm
              v-if="row.state === 'unfreeze'"
              title="确定要撤销订单？"
              @confirm="confirmFail(row)"
      >
        <a class="ant-dropdown-link"><a-icon type="close-square" /> 撤销 </a>
      </a-popconfirm>

      <a-popconfirm
        v-if="row.state === 'unfreeze'"
        title="确认订单失败？"
        @confirm="confirmFail(row)"
      >
        <a class="ant-dropdown-link"><a-icon type="close-circle" /> 失败 </a>
      </a-popconfirm>
      <a-popconfirm
        v-if="tookLimit(row)"
        title="确认解除订单锁定？"
        @confirm="confirmUnlock(row)"
      >
        <a class="ant-dropdown-link"><a-icon type="stop" /> 解除锁定 </a>
      </a-popconfirm>
    </span>
  </the-table>
</template>
<script>
import theTable from '@/components/theTable.vue'
import { parseISO, compareAsc, addMinutes } from 'date-fns'
import { mapGetters } from 'vuex'

const columns = [
  {
    title: '商户号',
    dataIndex: 'seller.code',
    searchAble: true,
    visible: false,
  },
  {
    title: '商户名',
    dataIndex: 'seller.username',
    searchAble: true,
  },
  {
    title: '订单号',
    dataIndex: 'id',
    searchAble: true,
    visible: false,
  },
  {
    title: '商户订单号',
    dataIndex: 'transaction_id',
    searchAble: true,
    visible: false,
  },
  {
    title: '出币值',
    dataIndex: 'coins',
  },
  {
    title: '手续费',
    dataIndex: 'seller_fee',
  },
  {
    title: '单笔奖励',
    dataIndex: 'seller_tip',
  },
  {
    title: '银行',
    dataIndex: 'bank',
  },
  {
    title: '银行卡',
    dataIndex: 'bankcard',
  },
  {
    title: '开户人',
    dataIndex: 'realname',
  },
  {
    title: '下发时间',
    dataIndex: 'created_at',
  },
  {
    title: '接单时间',
    dataIndex: 'took_at',
  },
  {
    title: '完成时间',
    dataIndex: 'unfreeze_at',
  },
  {
    title: '接单用户',
    dataIndex: 'member.username',
    searchAble: true,
  },
  {
    title: '状态',
    dataIndex: 'state',
    width: 80,
    customRender: (val) => {
      const map = new Map([
        ['waiting', '待接单'],
        ['took', '已接单'],
        ['frozen', '已冻结'],
        ['locking', '已锁定'],
        ['unfreeze', '已完成'],
        ['canceled', '已取消'],
        ['fail', '已失败'],
      ])
      return map.get(val)
    },
  },

  {
    title: '操作',
    key: 'action',
    scopedSlots: { customRender: 'action' },
    width: 180,
  },
]

export default {
  components: { theTable },

  data() {
    return {
      columns,
    }
  },
  computed: {
    ...mapGetters('account', ['sys']),
  },
  mounted() {},
  methods: {
    tookLimit(row) {
      if (row.state === 'took') {
        const m = this.sys.took_lock_minutes
        const limit = addMinutes(parseISO(row.took_at), m)
        // console.log(limit)
        return compareAsc(new Date(), limit) === 1
      }
      return false
    },
    confirmFail(row) {
      // console.log(row.id)
      this.axios.put(`/a/buys/${row.id}/fail`).then((res) => {
        if (res.data.code === 1) {
          this.$message.success('操作成功')
          this.$refs.table.onRefresh()
        } else {
          this.$message.error(res.data.msg)
        }
      })
    },
    confirmUnlock(row) {
      this.axios.put(`/a/buys/${row.id}/unlock`).then((res) => {
        if (res.data.code === 1) {
          this.$message.success('操作成功')
          this.$refs.table.onRefresh()
          this.$store.dispatch('account/noticeCount')
        } else {
          this.$message.error(res.data.msg)
        }
      })
    },
  },
}
</script>
